<template>
  <div class="app-container">
    <el-card v-for="item in dataList" class="box-card">
      <div
        style="font-size: 18px; font-weight: bold; margin: 10px 15px 15px 15px"
      >
        {{ item.name }}
      </div>
      <div style="display: flex; flex-wrap: wrap">
        <div
          class="app-div"
          v-for="cardItem in item.quantityItem"
          v-if="isuserLevel !== cardItem.isuserLevel"
        >
          <img :src="cardItem.img" />
          <div class="app-click" @click="clikcCard(cardItem.path)"></div>
        </div>
      </div>
    </el-card>
  </div>
</template>

<script>
import one from "../../assets/Marketing tools/1@3x.png";
import two from "../../assets/Marketing tools/2@3x.png";
import three from "../../assets/Marketing tools/3@3x.png";
import four from "../../assets/Marketing tools/4@3x.png";
import five from "../../assets/Marketing tools/1 拷贝@3x.png";
import six from "../../assets/Marketing tools/1 拷贝 9@3x.png";
import seven from "../../assets/Marketing tools/1 拷贝 8@3x.png";
import eight from "../../assets/Marketing tools/1 拷贝 7@3x.png";
import nine from "../../assets/Marketing tools/1 拷贝 6@3x.png";
import ten from "../../assets/Marketing tools/1 拷贝 5@3x.png";
import eleven from "../../assets/Marketing tools/1 拷贝 4@3x.png";
import twelve from "../../assets/Marketing tools/1 拷贝 3@3x.png";
import thirteen from "../../assets/Marketing tools/1 拷贝 2@3x.png";
import fourteen from "../../assets/Marketing tools/1 拷贝 20@3x.png";
import fifteen from "../../assets/Marketing tools/1 拷贝 19@3x.png";
import sixteen from "../../assets/Marketing tools/1 拷贝 14@3x.png";
import seventeen from "../../assets/Marketing tools/1 拷贝 13@3x.png";
import eighteen from "../../assets/Marketing tools/1 拷贝 12@3x.png";
import nineteen from "../../assets/Marketing tools/1 拷贝 11@3x.png";
import twenty from "../../assets/Marketing tools/1 拷贝 10@3x.png";
import { employeeSign } from "@/api/dept";
export default {
  name: "Marketing_Tools",
  data() {
    return {
      isuserLevel: null,
      dataList: [
        {
          name: "充值类型",
          quantityItem: [
            {
              img: one,
              couponsName: "充值立减",
              path: "/market/reductionActivity",
            },
            {
              img: two,
              couponsName: "充值送金额",
              path: "/customer/card/Dzk_RuleList",
            },
            {
              img: three,
              couponsName: "充值送券",
              path: "/customer/card/Dzk_RuleList",
            },
            {
              img: four,
              couponsName: "充值送积分",
              path: "/customer/card/Dzk_RuleList",
            },
          ],
        },
        {
          name: "消费类型",
          quantityItem: [
            {
              img: five,
              couponsName: "定额消费立减",
              path: "/market/reductionActivity",
            },
            {
              img: thirteen,
              couponsName: "定量消费立减",
              path: "/market/reductionActivity",
            },
            {
              img: twelve,
              couponsName: "每升消费立减",
              path: "/market/reductionActivity",
            },
            {
              img: eleven,
              couponsName: "消费积分",
              path: "/customer/point/Point_Rule",
            },
            {
              img: ten,
              couponsName: "消费返现",
              path: "/customer/card/Dzk_RuleList",
            },
            {
              img: nine,
              couponsName: "会员卡积分",
              path: "/customer/card/Dzk_Rule",
            },
          ],
        },
        {
          name: "优惠券类型",
          quantityItem: [
            {
              img: eight,
              couponsName: "现金券",
              path: "/market/coupon/Coupon_CreateCoupon",
            },
            {
              img: seven,
              couponsName: "折扣券",
              path: "/market/coupon/Coupon_CreateCoupon",
            },
            {
              img: six,
              couponsName: "洗车券",
              path: "/market/coupon/Coupon_CreateCoupon",
            },
            {
              img: twenty,
              couponsName: "注册发券",
              path: "/market/coupon/Coupon_CreateIssue",
            },
            {
              img: nineteen,
              couponsName: "手动领券",
              path: "/market/coupon/Coupon_CreateIssue",
            },
            {
              img: eighteen,
              couponsName: "消费后发券",
              path: "/market/coupon/Coupon_CreateIssue",
            },
            {
              img: seventeen,
              couponsName: "手动发券",
              path: "/market/coupon/Coupon_Grant",
            },
            {
              img: sixteen,
              couponsName: "积分兑换券",
              path: "/customer/point/Point_Rroduct",
            },
          ],
        },
        {
          name: "按用户类型",
          quantityItem: [
            {
              img: fourteen,
              couponsName: "标签用户",
              path: "/market/label/Label_Management",
            },
            {
              img: fifteen,
              couponsName: "超级会员",
              path: "/market/market/super",
              isuserLevel: "2",
            },
          ],
        },
      ],
    };
  },
  created() {
    let userLevel = this.$store.state.user.userLevel;
    if (["2"].includes(userLevel)) {
      employeeSign().then((res) => {
        if (res.msg === "0") {
          this.isuserLevel = "2";
        }
      });
    }
  },
  methods: {
    clikcCard(path) {
      this.$router.push({ path, query: { marking: "1" } });
    },
  },
};
</script>
<style lang="scss" scoped>
.app-click {
  width: 250px;
  height: 200px;
  position: absolute;
  left: 15px;
}
.box-card {
  padding: 0px;
  margin: 0px 0px 25px 0px;
}
.app-div {
  display: flex;
  flex-direction: column;
  width: 280px;
  height: 220px;
  position: relative;
}
.app-div:hover {
  transform: scale(1.04);
}
</style>
